<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="UTF-8">
   <title>register</title>
   <script>
      var bool_uname = false;

      function tip_uname() {
         uname_msg.innerHTML = "请输入4~10位用户名";
      }

      function check_uname() {
         bool_uname = false;
         if (!uname.value) {
            uname_msg.innerHTML = "请输入4~10位用户名";
         } else if (uname.value.length >= 4 && uname.value.length <= 10) {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
               if (xhr.status == 200 && xhr.readyState == 4) {
                  var result = xhr.responseText;
                  if (result == 1) {
                     uname_msg.innerHTML = "用户名已存在";
                  } else {
                     uname_msg.innerHTML = "√";
                     bool_uname = true;
                  }
               }
            }
            var url = "http://localhost:8080/user/v1/queryUser/" + uname.value;
            xhr.open("get", url, true);
            xhr.send();
         } else {
            uname_msg.innerHTML = "×";
         }
      }

      function register() {
         if (!bool_uname) {
            alert("信息不对")
            return;
         }
         var xhr = new XMLHttpRequest();
         xhr.onreadystatechange = function () {
            if (xhr.status == 200 && xhr.readyState == 4) {
               var result = xhr.responseText;
               console.log(result);
               if (result == 1) {
                  alert("注册成功");
                  location.href = "user_login.html";
               } else {
                  alert("注册失败");
               }
            }
         }
         var url = "http://localhost:8080/user/v1/reg";
         xhr.open("post", url, true);
         xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

         var gender = -1;
         if (man.checked) {
            gender = 1;
         } else if (woman.checked) {
            gender = 0;
         }
         var formdata = "uname=" + uname.value + "&upwd=" + upwd.value +
            "&email=" + email.value + "&phone=" + phone.value +
            "&gender=" + gender;

         xhr.send(formdata);
      }
   </script>
</head>

<body>

   <fieldset>
      <legend>用户注册</legend>
      <p>
         姓名 <input type="text" id="uname" onfocus="tip_uname()" onblur="check_uname()">
         <span id="uname_msg"></span>
      </p>
      <p>
         密码 <input type="text" id="upwd">
      </p>
      <p>
         邮箱 <input type="text" id="email">
      </p>
      <p>
         电话 <input type="text" id="phone">
      </p>
      <p>
         性别 <input type="radio" name="gender" id="man" checked>
         <label for="man">男</label>
         <input type="radio" name="gender" id="woman">
         <label for="woman">女</label>
         <input type="radio" name="gender" id="none">
         <label for="none">保密</label>
      </p>
      <button onclick="register()">注册</button>

   </fieldset>


</body>

</html>